<template>
  <div
    class="flex flex-col items-center justify-center space-y-8 box-border p-8"
  >
    <template v-for="row of rows" :key="row.name">
      <a class="row" :href="`/#/${row.page}`" >{{ row.name }}</a>
    </template>
  </div>
</template>

<script setup lang="ts">
const rows = [
  {
    name: '准提梵字',
    page: 'fanzi',
  },
  {
    name: '占察辅助工具',
    page: 'zhancha',
  },
  {
    name: '占察历史纪录',
    page: 'zhancha/History',
  },
];
</script>

<style scoped>
.row {
  @apply h-24 bg-gray-100 w-full flex items-center justify-center;
}
</style>
